{% extends 'IcsocUIBundle::page.html.twig' %}
{% block stylesheet %}
    {{ parent() }}
    {% stylesheets
    '@IcsocUIBundle/Resources/public/css/bootstrap.my.css'
    '@gritter_css'
    filter='cssrewrite' filter='uglifycss'
    %}
    <link rel="stylesheet" href="{{ asset_url }}" />
    {% endstylesheets %}
{% endblock %}
{% block content %}
    <button class="btn btn-info btn-sm btn-bold" id="open_window" style="margin: 2px;display: none;">
        <i class="ace-icon fa fa-th-large red2"></i> 全屏窗口
    </button>
    <button class="btn btn-success btn-sm" id="open_fullscreen" style="margin: 2px;display: none;" onclick="fn_fullscreen();">
        <i class="ace-icon fa fa-arrows-alt blue"></i> 全屏
    </button>
    <button class="btn btn-success btn-sm pull-right" id="close_fullscreen" style="margin: 2px;display: none;" onclick="close_fullscreen();">
        <i class="ace-icon fa fa-arrows red2"></i> 退出全屏
    </button>
    <div id="fullscreen" style="margin:0 auto;background:#ffffff;">
        {% if is_call_show == 1 %}
            <!-- 显示呼叫中心话务数据Begin -->
            <div class="row" style="margin:1px;">
                {% for key,value in call_center %}
                    <div class="progress" style="height:80px">
                        {% for call in value %}
                            <div class="progress-bar" style="background-color: {{ call.style.background }};box-shadow: none;padding: 3px;line-height: 18px;width: {{ rates.call_rate[key] }}">
                                <span class="sr-only"> 10% Complete (success) </span>
                                <span style="font: 180% Arial; font-size: {{ call.style.fontSize }};color: {{ call.style.fontColor }} !important">{{ call.name }}</span><br>
                                <span style="font: 200% Arial; font-size: {{ call.style.fontSize }};color: {{ call.style.fontColor }} !important;" id="{{ call.id }}">0</span>
                            </div>
                        {% endfor %}
                    </div>
                {% endfor %}
            </div>
            <!-- 显示呼叫中心话务数据End -->
        {% endif %}
        {% if user_type == 0 or user_type == 1 %}
            <!-- 显示技能组话务数据Begin -->
            {% if is_que_show == 1 %}
                <div class="row" style="margin:1px;">
                    {% for key,que in queInfos %}
                        <!-- 创建panel BEGIN-->
                        <div class="panel panel-info" id="que{{ que.id }}">
                            <div class="panel-heading">{{ que.que_name }}</div>
                            <div class="panel-body" style="padding: 2px;">
                                {% for key,value in que_center %}
                                    <div class="progress" style="height:80px">
                                        {% for ques in value %}
                                            <div class="progress-bar" style="width: {{ rates.que_rate[key] }};background-color: {{ ques.style.background }};box-shadow: none;padding: 3px;line-height: 18px;">
                                                <span class="sr-only"> 10% Complete (success) </span>
                                                <span style="font: 180% Arial; font-size: {{ ques.style.fontSize }};color: {{ ques.style.fontColor }} !important">{{ ques.name }}</span><br>
                                                <span style="font: 200% Arial; font-size: {{ ques.style.fontSize }};color: {{ ques.style.fontColor }} !important" id="que{{ que.id }}_{{ ques.id }}">0</span>
                                            </div>
                                        {% endfor %}
                                    </div>
                                {% endfor %}
                                {% if isEnableGroup == 1 and is_agent_show == 1 and is_agent_group_show == 1 %}
                                    <div class="progress" name="questrip" style="height:100%; padding-left: 0px;" id="que{{ que.id }}_strip"></div>
                                    {% if que.group_info is empty %}
                                        {#<div class="alert alert-block alert-danger">#}
                                        {#<button type="button" class="close" data-dismiss="alert">#}
                                        {#<i class="ace-icon fa fa-times"></i>#}
                                        {#</button>#}
                                        {#<i class="ace-icon fa fa-times"></i>#}
                                        {#该技能组未配置所属业务组#}
                                        {#</div>#}
                                    {% else %}
                                        {% for group in que.group_info %}
                                            <div class="panel panel-info" id="que{{ que.id }}_group{{ group.group_id }}">
                                                <div class="panel-heading">{{ group.group_name }}</div>
                                                <div class="panel-body" style="padding: 2px;">
                                                    <div class="progress" name="strip" data-type="group{{ group.group_id }}_strip" style="height:100%; padding-left: 0px;" id="que{{ que.id }}_group{{ group.group_id }}_strip"></div>
                                                    <div name="agentdetail" data-type="group{{ group.group_id }}_agent" id="que{{ que.id }}_group{{ group.group_id }}_agent"></div>
                                                </div>
                                            </div>
                                        {% endfor %}
                                    {% endif %}
                                {% endif %}
                            </div>
                        </div>
                        <!-- 创建panel END-->
                    {% endfor %}
                </div>
            {% endif %}
            <!-- 显示技能组话务数据End -->
        {% else %}
            <div class="alert alert-block alert-danger">
                <button type="button" class="close" data-dismiss="alert">
                    <i class="ace-icon fa fa-times"></i>
                </button>
                <i class="ace-icon fa fa-times"></i>
                该角色无任何技能组权限
            </div>
        {% endif %}
    </div>
{% endblock %}
{% block footer %}
    {% javascripts
    '@IcsocUIBundle/Resources/public/js/amazeui.min.js'
    '@gritter_js'
    'bundles/icsocui/js/json.js'
    'bundles/icsocui/js/reconnecting-websocket.js'
    filter='uglifyjs'
    %}
    <script src="{{ asset_url }}"></script>
    {% endjavascripts %}
    <script type="text/javascript">

        /**
         * 坐席状态阈值限制JSON数据
         */
        var agentLimit = {{ agentLimit|raw }};

        /**
         * 坐席状态样式JSON数据
         */
        var agentStyle = {{ agentStyle|raw }};

        /**
         * socket连接的IP地址
         */
        var socket_ip = '{{ socketIp }}';

        /**
         * socket连接端口
         */
        var socket_port = '{{ socketPort }}';

        /**
         * 企业ID
         */
        var vcc_id = parseInt('{{ vcc_id }}');

        /**
         * websocket连接地址
         */
        var websocket_url = null;

        /**
         * websocket对象
         */
        var websocket = null;

        /**
         * 初始化agent数据
         */
        var agents = {};

        var heart_packet = {"action": "heartbeat", "data": "ping"};

        var last_server_time = 0;

        var heart_monitor = null;

        $(document).ready(function() {
            var refresh_time = parseInt('{{ refresh_time }}');
            refresh_time = refresh_time * 1000;
            {% if is_call_show == 1 %}
            get_call_center_data();
            window.setInterval(get_call_center_data, refresh_time);
            {% endif %}
            {% if is_que_show == 1 and user_type == 0 or user_type == 1 %}
            get_que_center_data();
            window.setInterval(get_que_center_data, refresh_time);
            {% endif %}
            {% if isEnableGroup == 1 and is_agent_show == 1 and is_agent_group_show == 1 %}
            window.setInterval(refreshTime, 1000);
            get_socket_agent_data();
            {% endif %}
            $("#open_window").on('click', function() {
                var url = self.location.href;
                url = url + "&is_fullscreen=1";
                window.open(url);
            });
            {% if is_fullscreen == 0 %}
            $("#open_window").css('display', '');
            $("#open_fullscreen").css('display', 'none');
            $("#close_fullscreen").css('display', 'none');
            {% else %}
            $("#open_window").css('display', 'none');
            $("#open_fullscreen").css('display', '');
            $("#close_fullscreen").css('display', '');
            {% endif %}
        });

        //获取呼叫中心话务数据
        function get_call_center_data()
        {
            var url = "{{ path('icsoc_monitor_screen_callcenter_data') }}";
            $.ajax({
                type: 'post',
                url: url,
                data: {'call_data':'{{ json_call_center }}', 'role_id': '{{ role_id }}'},
                dataType: 'json',
                cache: false,
                success: function(responce)
                {
                    if (responce.code == 200) {
                        $.each(responce.data, function(index,value) {
                            if ($("#"+index).length > 0) {
                                //证明此元素存在
                                $("#"+index).html(value);
                            }
                        });
                    } else {
                        console.info(responce);
                    }
                }
            });
        }

        //获取技能组话务数据
        function get_que_center_data()
        {
            var ques = [];
            var que_id = "";
            {% for key,que in queInfos %}
            ques.push('{{ que.id }}');
            {% endfor %}
            que_id = ques.join(",");
            //调用获取技能组数据地址
            var url = "{{ path('icsoc_monitor_screen_quecenter_data') }}";
            $.ajax({
                type: 'post',
                url: url,
                data: {'que_data':'{{ json_que_center }}','que_id':que_id, 'role_id': '{{ role_id }}'},
                dataType: 'json',
                cache: false,
                success: function(responce)
                {
                    if (responce.code == 200) {
                        $.each(responce.data, function(index,value) {
                            //此index为技能组ID
                            if ($("#que"+index).length > 0) {
                                $.each(value, function(key, item) {
                                    if ($("#que"+index+"_"+key).length > 0) {
                                        $("#que"+index+"_"+key).html(item);
                                    }
                                });
                            }
                        });
                    } else {
                        console.info(responce);
                    }
                }
            });
        }

        //连接socket，获取坐席状态数据
        function get_socket_agent_data()
        {
            var group_id = [];//JSON数组
            var que_id = [];//JSON数组
            //无限技能组权限
            {% if isEnableGroup == 1 and is_agent_show == 1 and is_agent_group_show == 1 %}
            group_id = {{ groupIds|raw }};
            {% endif %}

            websocket_url = "ws://" + socket_ip + ":" + socket_port;
            websocket = new ReconnectingWebSocket(websocket_url, null, {debug: true, reconnectInterval: 3000, maxReconnectInterval: 10000});

            var initMessage = {'action':'init','data':{'vcc_id':vcc_id,'queue_id':que_id,'group_id':group_id}};
            websocket.onopen = function () {
                websocket.send(JSON.stringify(initMessage));
            };
            websocket.onmessage = function (MessageEvent) {
                var responceMessage = MessageEvent.data;
                if (responceMessage.length > 0) {
                    responceMessage = $.evalJSON(responceMessage);
                    var action = responceMessage.action;
                    if (action == "init") {
                        start_monitor_heart();
                        var agentData = responceMessage.data;
                        if (agentData.length > 0) {
                            $.each(agentData, function (index, value) {
                                var opId = parseInt(value.op_id);
                                var agId = value.ag_id;
                                if ((typeof agents[agId]) != "undefined" && agents[agId] > opId) {
                                    return true;
                                }
                                agents[value.ag_id] = opId;
                                var agentDiv = "group"+value.group_id+"_agent";
                                var row = "div[name='agentdetail'][data-type='"+agentDiv+"']";
                                if ($(row).length > 0) {
                                    $(row).each(function () {
                                        var realId = $(this).attr("id");
                                        var stripId = $(this).siblings("div[name='strip']").attr("id");
                                        var queStripId = $(this).parent().parent().siblings("div[name='questrip']").attr("id");
                                        var queId = $(this).parent().parent().parent().parent().attr("id");
                                        var group_btn_id = realId+"_btn_"+value.ag_id;
                                        var group_btn = create_btn(value, group_btn_id);
                                        $("#"+group_btn_id).parent().remove();
                                        $(this).append(group_btn);

                                        var group_div = $("#"+realId+" span").toArray().sort(function(a,b){
                                            return parseInt($(a).attr('sort')) - parseInt($(b).attr('sort'))
                                        });
                                        $(group_div).appendTo("#"+realId);
                                        update_strip_data("#"+stripId, "#"+realId);
                                        update_total_strip_data("#"+queStripId, queId);
                                    });
                                }
                            });
                        }
                    } else {
                        if (action == 'heartbeat') {
                            last_server_time = get_now_time();
                        } else if (action == 'reset') {
                            init_data();
                        } else if (action == 'reload') {
                            //坐席重载
                            var agentReloadData = responceMessage.data;
                            var newGroupId = agentReloadData.new_group_id;
                            var delGroupId = agentReloadData.del_group_id;
                            var agentReloadAgId = agentReloadData.ag_id;
                            var agentopId = parseInt(agentReloadData.op_id);
                            agents[agentReloadAgId] = agentopId;
                            if (newGroupId != 0) {
                                var GroupAgentId = "group"+newGroupId+"_agent";
                                console.info(GroupAgentId);
                                var agentGroupRow = "div[name='agentdetail'][data-type='"+GroupAgentId+"']";
                                if ($(agentGroupRow).length > 0) {
                                    $(agentGroupRow).each(function () {
                                        var realId = $(this).attr("id");
                                        var stripId = $(this).siblings("div[name='strip']").attr("id");
                                        var queStripId = $(this).parent().parent().siblings("div[name='questrip']").attr("id");
                                        var queId = $(this).parent().parent().parent().parent().attr("id");
                                        var group_btn_id = realId+"_btn_"+agentReloadAgId;
                                        var groupDiv = "#"+group_btn_id;
                                        //新增
                                        var group_btn = create_btn(agentReloadData, group_btn_id);
                                        $(groupDiv).parent().remove();
                                        $("#"+realId).append(group_btn);

                                        var groupd_div = $("#"+realId+" span").toArray().sort(function(a,b){
                                            return parseInt($(a).attr('sort')) - parseInt($(b).attr('sort'))
                                        });
                                        $(groupd_div).appendTo("#"+realId);
                                        update_strip_data("#"+stripId, "#"+realId);
                                        update_total_strip_data("#"+queStripId, queId);
                                    });
                                }
                            }

                            if (delGroupId != 0) {
                                var delGroupAgentId = "group"+delGroupId+"_agent";
                                console.info(delGroupAgentId);
                                var delAgentGroupRow = "div[name='agentdetail'][data-type='"+delGroupAgentId+"']";
                                if ($(delAgentGroupRow).length > 0) {
                                    $(delAgentGroupRow).each(function () {
                                        var realId = $(this).attr("id");
                                        var stripId = $(this).siblings("div[name='strip']").attr("id");
                                        var queStripId = $(this).parent().parent().siblings("div[name='questrip']").attr("id");
                                        var queId = $(this).parent().parent().parent().parent().attr("id");
                                        var group_btn_id = realId+"_btn_"+agentReloadAgId;
                                        var groupDiv = "#"+group_btn_id;
                                        //新增
                                        $(groupDiv).parent().remove();
                                        var groupd_div = $("#"+realId+" span").toArray().sort(function(a,b){
                                            return parseInt($(a).attr('sort')) - parseInt($(b).attr('sort'))
                                        });
                                        $(groupd_div).appendTo("#"+realId);
                                        update_strip_data("#"+stripId, "#"+realId);
                                        update_total_strip_data("#"+queStripId, queId);
                                    });
                                }
                            }
                        } else {
                            var data = responceMessage.data;
                            var opId = parseInt(data.op_id);
                            var agId = data.ag_id;
                            var groupId = data.group_id;
                            if (((typeof agents[agId]) == "undefined") || opId == 2 || ((typeof agents[agId]) != "undefined" && (agents[agId] < opId || agents[agId] - opId > 5))) {
                                agents[agId] = opId;
                                var groupAgentDiv = "group"+groupId+"_agent";
                                var groupRow = "div[name='agentdetail'][data-type='"+groupAgentDiv+"']";
                                if ($(groupRow).length > 0) {
                                    $(groupRow).each(function () {
                                        var realId = $(this).attr("id");
                                        var stripId = $(this).siblings("div[name='strip']").attr("id");
                                        var queStripId = $(this).parent().parent().siblings("div[name='questrip']").attr("id");
                                        var queId = $(this).parent().parent().parent().parent().attr("id");
                                        var group_btn_id = realId+"_btn_"+agId;
                                        var groupDiv = "#"+group_btn_id;
                                        switch (action) {
                                            case "insert":
                                            case "update":
                                                //新增
                                                var group_btn = create_btn(data, group_btn_id);
                                                $(groupDiv).parent().remove();
                                                $("#"+realId).append(group_btn);
                                                break;
                                            case "delete":
                                            default:
                                                //删除
                                                $(groupDiv).parent().remove();
                                                break;
                                        }

                                        var groupd_div = $("#"+realId+" span").toArray().sort(function(a,b){
                                            return parseInt($(a).attr('sort')) - parseInt($(b).attr('sort'))
                                        });
                                        $(groupd_div).appendTo("#"+realId);
                                        update_strip_data("#"+stripId, "#"+realId);
                                        update_total_strip_data("#"+queStripId, queId);
                                    });
                                }
                            }
                        }
                    }
                }
            };

            websocket.onclose = function () {
                $.gritter.add({
                    title: '提示',
                    text: '监控连接断开',
                    class_name: 'gritter-error'
                });
                console.info("socket closed.");
                init_data();
            };

            websocket.onerror = function () {
                $.gritter.add({
                    title: '提示',
                    text: '监控连接发生异常断开',
                    class_name: 'gritter-error'
                });
                console.info("socket error");
                init_data();
            };
        }

        /**
         * 开启客户端心跳包
         */
        function start_monitor_heart()
        {
            heart_monitor = setInterval(function () {
                if (websocket != null) {
                    websocket.send(JSON.stringify(heart_packet));
                }
                if (last_server_time != 0 && get_now_time() - last_server_time >= 30) {
                    refresh();
                }
            }, 20000);
        }

        /**
         * 重置定时器，关闭socket重连
         */
        function refresh()
        {
            last_server_time = 0;
            clearInterval(heart_monitor);
            websocket.refresh();
        }

        /**
         * 获取当前时间戳
         */
        function get_now_time()
        {
            var _time = Date.parse(new Date());
            return _time/1000;
        }

        /**
         * 初始化坐席数据
         */
        function init_data()
        {
            //去除坐席明细数据
            $("div[name='agentdetail']").each(function(index, value) {
                $(this).empty();
            });
            //去除业务组中的总条数
            $("div[name='strip']").each(function (index, value) {
                $(this).empty();
            });
            //去除技能组中的总条数
            $("div[name='questrip']").each(function (index, value) {
                $(this).empty();
            });

            agents = {};

            refresh();
        }

        /**
         * 生成总进度条
         */
        function update_strip_data(stripId, agentId)
        {
            var html = "";
            var total = 0;//状态数总数
            var total_rate = 1;
            var last_rate = 1;
            var agentStatus = {};
            var sortAgentStatus = [];
            if ($(stripId).length > 0) {
                $(stripId).empty();
                //整理agents中的总数
                if ($(agentId+" span").length > 0) {
                    $(agentId+" span").each(function (index, item) {
                        //计算ag_status的总数
                        var ag_status = $(item).attr("sort");
                        if (typeof agentStatus[ag_status] == "undefined") {
                            agentStatus[ag_status] = {"nums":1, "ag_status":ag_status};
                            total = total + 1;
                        } else {
                            agentStatus[ag_status]['nums'] = agentStatus[ag_status]['nums'] + 1;
                            total = total + 1;
                        }
                    });
                    //json串形成json数组
                    $.each(agentStatus, function(i, v) {
                        sortAgentStatus.push(v);
                    });
                }
                //排序后的数据
                sortAgentStatus = jsonSort(sortAgentStatus, "nums", false);
                if (sortAgentStatus.length > 0) {
                    var len = sortAgentStatus.length;
                    $.each(sortAgentStatus, function (index, item) {
                        var nums;
                        if (item.nums == 0 || typeof item.nums == "undefined") {
                            nums = 0;
                        } else {
                            nums = item.nums;
                        }
                        if (nums != 0) {
                            var rate = parseFloat(nums/total).toFixed(3);
                            if (rate < 0.015) {
                                rate = 0.015;
                                total_rate = total_rate - 0.015;
                                last_rate = last_rate - 0.015;
                            } else {
                                if (index == len-1) {
                                    rate = total_rate;
                                } else {
                                    rate = parseFloat(rate/last_rate).toFixed(3);
                                    total_rate = total_rate - rate;
                                }
                            }
                            rate = parseFloat(rate*100).toFixed(3)+"%";
                            html += '<div class="progress-bar" sort="'+item.ag_status+'" style="background-color: '+agentStyle[item.ag_status]['background']+' !important;padding: 3px;width:'+rate+';line-height: 18px;">';
                            html += '<span class="sr-only">10% Complete (success) </span>';
                            html += '<span style="font: 200% Arial;color:'+agentStyle[item.ag_status]['fontColor']+' !important;font-size:20px">'+nums+'</span>';
                            html += '</div>';
                        }
                    });
                    //存在坐席数据
                    if (html != "") {
                        $(stripId).html(html);
                        var div = $(stripId+" div").toArray().sort(function(a,b){
                            return parseInt($(a).attr('sort')) - parseInt($(b).attr('sort'))
                        });

                        $(div).appendTo(stripId);
                    }
                }
            }
        }

        /**
         * 生成技能组总进度条
         */
        function update_total_strip_data(queStripId, queId)
        {
            var agentStatus = {};
            var sortAgentStatus = [];
            var total = 0;
            var total_rate = 1;
            var last_rate = 1;
            var html = "";
            if ($(queStripId).length > 0) {
                //证明此节点存在
                $(queStripId).empty();
                var queAgentId = "div[name='agentdetail'][id^='"+queId+"']";
                if ($(queAgentId).length > 0) {
                    $(queAgentId).each(function (index, queAgent) {
                        var agentId = "#"+$(queAgent).attr("id");
                        if ($(agentId+" span").length > 0) {
                            $(agentId+" span").each(function (i, item) {
                                //计算ag_status的总数
                                var ag_status = $(item).attr("sort");
                                if (typeof agentStatus[ag_status] == "undefined") {
                                    agentStatus[ag_status] = {"nums":1, "ag_status":ag_status};
                                    total = total + 1;
                                } else {
                                    agentStatus[ag_status]['nums'] = agentStatus[ag_status]['nums'] + 1;
                                    total = total + 1;
                                }
                            });
                        }

                    });
                    //json串形成json数组
                    $.each(agentStatus, function(i, v) {
                        sortAgentStatus.push(v);
                    });
                    //排序后的数据
                    sortAgentStatus = jsonSort(sortAgentStatus, "nums", false);
                }

                if (sortAgentStatus.length > 0) {
                    var len = sortAgentStatus.length;
                    $.each(sortAgentStatus, function (index, item) {
                        var nums;
                        if (item.nums == 0 || typeof item.nums == "undefined") {
                            nums = 0;
                        } else {
                            nums = item.nums;
                        }
                        if (nums != 0) {
                            var rate = parseFloat(nums/total).toFixed(3);
                            if (rate < 0.015) {
                                rate = 0.015;
                                total_rate = total_rate - 0.015;
                                last_rate = last_rate - 0.015;
                            } else {
                                if (index == len-1) {
                                    rate = total_rate;
                                } else {
                                    rate = parseFloat(rate/last_rate).toFixed(3);
                                    total_rate = total_rate - rate;
                                }
                            }
                            rate = parseFloat(rate*100).toFixed(3)+"%";
                            html += '<div class="progress-bar" sort="'+item.ag_status+'" style="background-color: '+agentStyle[item.ag_status]['background']+' !important;padding: 3px;width:'+rate+';line-height: 18px;">';
                            html += '<span class="sr-only">10% Complete (success) </span>';
                            html += '<span style="font: 200% Arial;color:'+agentStyle[item.ag_status]['fontColor']+' !important;font-size:20px">'+nums+'</span>';
                            html += '</div>';
                        }
                    });
                    //存在坐席数据
                    if (html != "") {
                        $(queStripId).html(html);
                        var div = $(queStripId+" div").toArray().sort(function(a,b){
                            return parseInt($(a).attr('sort')) - parseInt($(b).attr('sort'))
                        });

                        $(div).appendTo(queStripId);
                    }
                }
            }
        }

        /**
         * @description		根据某个字段实现对json数组的排序
         * @param	 array	要排序的json数组对象
         * @param	 field	排序字段（此参数必须为字符串）
         * @param	 reverse  是否倒序（默认为false）
         * @return	array	返回排序后的json数组
         */
        function jsonSort(array, field, reverse)
        {
            //数组长度小于2 或 没有指定排序字段 或 不是json格式数据
            if(array.length < 2 || !field || typeof array[0] !== "object") return array;
            //数字类型排序
            if(typeof array[0][field] === "number") {
                array.sort(function(x, y) { return x[field] - y[field]});
            }
            //字符串类型排序
            if(typeof array[0][field] === "string") {
                array.sort(function(x, y) { return x[field].localeCompare(y[field])});
            }
            //倒序
            if(reverse) {
                array.reverse();
            }

            return array;
        }

        /**
         * 新建坐席
         *
         * @param item
         * @param id
         * @returns {string}
         */
        function create_btn(item,id)
        {
            var ag_name;
            if (item.ag_type == 2) {
                ag_name = "<strong style='font-weight:bold;color:red;margin-left:-5px;margin-right:-3px;'>Ｓ</strong>&nbsp;"+item.ag_name;
            } else {
                ag_name = item.ag_name;
            }

            var _strr = "";
            _strr += "<span sort='"+item.ag_status+"'><button id='"+id+"' type=\"button\" class=\"btn\" style=\"margin: 1px;padding: 1px;width:73px;height:65px;border-color:"+agentStyle[item.ag_status]['background']+" !important;background-color:"+agentStyle[item.ag_status]['background']+" !important;color:"+agentStyle[item.ag_status]['fontColor']+" !important;font-size:"+agentStyle[item.ag_status]['fontSize']+"\">";
            _strr += "<div>" +ag_name+"</div>";
            _strr += "<div>" +item.status+"</div>";
            _strr += "<div class='secs' data='"+item.ag_sta_time+"'>" +item.status_secs+"</div>";
            _strr += "</button></span>";

            return _strr;
        }

        //刷新时间
        function refreshTime()
        {
            $('.secs').each(function() {
                var secs = parseInt($(this).attr("data"));
                var agsta = $(this).parent().parent().attr('sort');
                var status = $(this).parent().children().eq(1).html();
                agsta = parseInt(agsta);
                if (agentLimit[agsta] == 0) {
                    $(this).parent().children().eq(1).html(status);
                } else {
                    if (secs >= agentLimit[agsta]) {
                        if ($(this).parent().children().eq(1).find("strong").length > 0) {
                            $(this).parent().children().eq(1).html(status);
                        } else {
                            $(this).parent().children().eq(1).html("<strong style='font: 90% 微软雅黑;color: red !important;font-weight:bold;'>!</strong>&nbsp;"+status);
                        }
                    } else {
                        $(this).parent().children().eq(1).html(status);
                    }
                }
                secs++;
                $(this).html(formate_time(secs));
                $(this).attr("data", secs);
            });
        }

        //格式化时间
        function formate_time(dur)
        {
            if(dur < 0)
            {
                return '';
            }
            else
            {
                var hour = parseInt(dur/3600);
                dur = dur%3600;
                var minute = parseInt(dur/60);
                var second = dur%60;
                if(hour < 10)
                {
                    hour = "0"+hour;
                }
                if(minute < 10)
                {
                    minute = "0"+minute;
                }
                if(second < 10)
                {
                    second = "0"+second;
                }

                var format_dur = hour+":"+minute+":"+second;
                return format_dur;
            }
        }

        /**
         * 调用全屏操作
         */
        function fn_fullscreen()
        {
            var e = $.AMUI.fullscreen;
            if (e.enabled) {
                e.request();
            } else {
                // Ignore or do something else
            }
        }

        /**
         * 退出全屏状态
         */
        function close_fullscreen()
        {
            var e = $.AMUI.fullscreen;
            if (e.enabled) {
                e.exit();
            } else {
                // Ignore or do something else
            }
        }
    </script>
{% endblock %}